<template>
  <div>
    <Echart
      :options="options"
      id="centreLeft1Chart"
      height="280px"
      width="450px"
    ></Echart>
  </div>
</template>

<script>
import Echart from "@/common/echart";
export default {
  data() {
    return {
      options: {
        xAxis: {
          data: ["一月", "二月", "三月", "四月", "五月"],
        },
        yAxis: {
          type: "value",
        },
        tooltip: {},
        legend: {
          itemWidth: 18,
          itemHeight: 18,
          data: ["类型一", "类型二"],
        },
        series: [
          {
            data: [10, 22, 28, 43, 49],
            type: "bar",
            stack: "x",
            name: "类型一",

            itemStyle: {
              normal: {
                color: "#41DDEA",
              },
            },
          },
          {
            name: "类型二",
            data: [5, 4, 3, 5, 10],
            type: "bar",
            stack: "x",
            itemStyle: {
              normal: {
                color: "#00BAFF",
              },
            },
          },
        ],
      },
    };
  },
  components: {
    Echart,
  },
  props: {
    cdata: {
      type: Object,
      default: () => ({}),
    },
  },
  // watch: {
  //   cdata: {
  //     handler(newData) {
  //       this.options = {
  //         color: [
  //           "#37a2da",
  //           "#32c5e9",
  //           "#9fe6b8",
  //           "#ffdb5c",
  //           "#ff9f7f",
  //           "#fb7293",
  //           "#e7bcf3",
  //           "#8378ea",
  //         ],
  //         tooltip: {
  //           trigger: "item",
  //           formatter: "{a} <br/>{b} : {c} ({d}%)",
  //         },
  //         toolbox: {
  //           show: true,
  //         },
  //         calculable: true,
  //         legend: {
  //           orient: "horizontal",
  //           icon: "circle",
  //           bottom: 0,
  //           x: "center",
  //           data: newData.xData,
  //           textStyle: {
  //             color: "#fff",
  //           },
  //         },
  //         series: [
  //           {
  //             name: "通过率统计",
  //             type: "pie",
  //             radius: [10, 50],
  //             roseType: "area",
  //             center: ["50%", "40%"],
  //             data: newData.seriesData,
  //           },
  //         ],
  //       };
  //     },
  //     immediate: true,
  //     deep: true,
  //   },
  // },
};
</script>

<style lang="scss" scoped></style>
